<html>
<head>
    <title>手续费列表</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/static/layui//css/layui.css">
    <script src="/static/layui/layui.all.js"></script>
    <script src="/static/js/jquery.min.js"></script>
    <script src="/static/js/dealParam.js"></script>
    <script src="/static/js/CodeConst.js"></script>
    <script src="/static/js/common.js"></script>

</head>

<body>
<fieldset class="layui-elem-field">
    <legend>交易参数管理--手续费</legend>
    <div class="layui-field-box">
        <div class="layui-inline">
            <#--<a href="/back/dealparam/fee/addpage" class="layui-btn layui-btn-normal" data-type="addUser">添加手续费</a>-->
            <button type='button' onclick='editRatio()' class="layui-btn layui-btn-normal">编辑</button>
        </div>
    </div>

</fieldset>
<div class="layui-form layui-border-box layui-table-view" lay-filter="LAY-table-1" style="width:1111px; ">
    <div class="layui-table-box">
        <div>
            <#--class="layui-table-header"-->
            <div class="layui-form-item">
                <label class="layui-form-label">币种</label>
                <div class="layui-form-select">
                    <select id="coinTypeSelect" name="coinTypeId" lay-filter="aihao">
                    </select>
                </div>
            </div>

            <table cellspacing="0" cellpadding="0" border="0" class="layui-table">
                <thead>
                <tr>
                    <!--编号、货币名称、交易场景、手续费、创建时间、操作-->
                    <th data-field="loginName">
                        <div class="layui-table-cell laytable-cell-1-loginName"><span>编号</span></div>
                    </th>
                    <th data-field="nickName">
                        <div class="layui-table-cell laytable-cell-1-nickName"><span>货币名称</span></div>
                    </th>
                    <th data-field="email">
                        <div class="layui-table-cell laytable-cell-1-email"><span>交易场景</span></div>
                    </th>
                    <th data-field="tel">
                        <div class="layui-table-cell laytable-cell-1-tel"><span>手续费</span></div>
                    </th>
                    <th data-field="createDate" data-unresize="true">
                        <div class="layui-table-cell laytable-cell-1-createDate"><span>基额</span></div>
                    </th>
                    <th data-field="7">
                        <div class="layui-table-cell laytable-cell-1-7" align="center"><span>创建时间</span></div>
                    </th>

                </tr>
                </thead>
            </table>
        </div>
        <div class="layui-table-body layui-table-main">
            <table cellspacing="0" cellpadding="0" border="0" class="layui-table">
                <tbody id="feeListTBody">
                </tbody>

            </table>
        </div>
        <style>
            .laytable-cell-1-0 {
                width: 48px;
            }

            .laytable-cell-1-loginName {
                width: 178px;
            }

            .laytable-cell-1-nickName {
                width: 130px;
            }

            .laytable-cell-1-email {
                width: 209px;
            }

            .laytable-cell-1-tel {
                width: 156px;
            }

            .laytable-cell-1-locked {
                width: 156px;
            }

            .laytable-cell-1-createDate {
                width: 235px;
            }

            .laytable-cell-1-7 {
                width: 196px;
            }
        </style>
    </div>
    <script>
        var coinTypeList = getCoinTypeList();
        var coinTypeSelect = $("#coinTypeSelect");
        coinTypeSelect.empty();
        var coinSelect = '';
        $.each(coinTypeList, function (index, coinType) {
            coinSelect += '<option value="' + coinType.id + '">' + coinType.simpleName + '</option>'
        });

        coinSelect = $(coinSelect);
        coinTypeSelect.append(coinSelect);


        var coinTypeList = getCoinTypeList();

        function getCoinType(coinTypeId) {
            for (var i = 0; i < coinTypeList.length; i++) {
                if (coinTypeList[i].id == coinTypeId)
                    return coinTypeList[i];
            }
            return null;
        }


        function loadData(baseDto) {

            dealBaseDto(baseDto, function (baseDto) {
                printJson(baseDto);
                var feeList = baseDto.data;
                var feeListTBody = $("#feeListTBody");
                feeListTBody.empty();
                $.each(feeList, function (index, fee) {
                    var text = " <tr data-index=\"0\" class=\"\">\n" +
                        "                    <td data-field=\"loginName\">\n" +
                        "                        <div id=\"+fee.id+\" class=\"layui-table-cell laytable-cell-1-loginName\">" + fee.id + "</div>\n" +
                        "                    </td>\n" +
                        "                    <td data-field=\"nickName\">\n" +
                        "                        <div class=\"layui-table-cell laytable-cell-1-nickName\">" + getCoinType(fee.coinTypeId).name + "</div>\n" +
                        "                    </td>\n" +
                        "                    <td data-field=\"email\">\n" +
                        "                        <div class=\"layui-table-cell laytable-cell-1-email\">" + fee.dealSceneName + "</div>\n" +
                        "                    </td>\n" +
                        "                    <td data-field=\"tel\">\n" +
                        "                        <input type='text' data-id='" + fee.id + "' data-count='" + fee.baseDealCount + "' class='ayui-table-cell laytable-cell-1-tel layyy'  value='" + fee.feeRatio + "' />" +
                        "                    </td>\n" +
                        "                    <td data-field=\"tel\">\n" +
                        "                        <input type='text' data-count='" + fee.baseDealCount + "' class='ayui-table-cell laytable-cell-1-createDate'  value='" + fee.baseDealCount + "' />" +
                        "                    </td>\n" +
                        "                    <td data-field=\"createDate\" data-content=\"1511792379000\">\n" +
                        "                        <div class=\"layui-table-cell laytable-cell-1-7\">" + fee.createTime + "</div>\n" +
                        "                    </td>\n" +
                        "           </tr>";
                    feeListTBody.append($(text));
                });
            })

        }

        function editRatio() {
            var raitoList = [];

            $("#feeListTBody tr .layyy").each(function () {
                raitoList.push({
                    id: $(this).attr("data-id"),
                    raito: $(this).val(),
                    count: $(this).parent().next().find("input").val()
                })
            });

            var text = JSON.stringify(raitoList);

            $.ajax({
                url: '/back/dealparam/fee/setAll',
                type: 'POST',
                dataType: 'json',
                data: {
                    list: text
                },
                success: function (res) {
                    if (res.code == 0) {
                        location.reload()
                    }
                }
            })

        }

        function init() {
            $.ajax(
                {
                    url: '/back/dealparam/fee/coinTypeId',
                    type: 'get',
                    data: {
                        coinTypeId: 1
                    },
                    success: function (baseDto) {
                        loadData(baseDto);
                    }
                }
            );
        }


        layui.use('form', function () {
            var form = layui.form;

            form.render('select'); //刷新select选择框渲染

            form.on('select(aihao)', function (data) {
                console.log(data.value);
                $.ajax(
                    {
                        url: '/back/dealparam/fee/coinTypeId',
                        type: 'get',
                        data: {
                            coinTypeId: data.value
                        },
                        success: function (baseDto) {
                            loadData(baseDto);
                        }
                    }
                );
            });
        });

        init();


    </script>
</body>
</html>